<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery.combobox</title>
<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="../themes/default/combobox.css" />
<script type="text/javascript" src="../jquery-1.10.2.js">
</script>
<script type="text/javascript" src="../src/jquery.parser.js">
</script>
<script type="text/javascript" src="../src/jquery.combobox.js">
</script>
<style>
</style>
</head>
<body style="padding:20px;">
<div class="input-append x-combobox">
  <input type="text" class="span x-combobox-text">
  <input type="hidden" name="c1" class="x-combobox-value">
  <span class="add-on x-combobox-arrow"><i class="icon-chevron-down"></i></span> 
</div>
<br>
<br>
<div class="input-append x-combobox">
  <input type="text" class="span x-combobox-text">
  <input type="hidden" name="c2" class="x-combobox-value">
</div>
 
<script type="text/javascript">
$('.x-combobox').combobox({
	 panelHeight:100,
	 //multiple:true,
	// disabled:true,
	data:[
		{text:'1',value:'1'},
		{text:'2',value:'2'},
		{text:'3',value:'3'},
		{text:'4',value:'4'},
		{text:'5',value:'5'},
		{text:'6',value:'6'},
		{text:'7',value:'7'},
		{text:'8',value:'8'},
		{text:'9',value:'9'}
	]
});

function onClickEditable () {
	$('.xui-combobox').combobox({editable:true});
}

function onClickNoEditable () {
	$('.xui-combobox').combobox({editable:false});
}

function onClickEnable () {
	$('.xui-combobox').combobox({disabled:false});
}

function onClickDisable () {
	$('.xui-combobox').combobox({disabled:true});
}

</script>
</body>
</html>